extends layout
append scripts
    script.
        //- ================================================================
        // find() 方法, 它本身又接收一个任意的选择器, 最常见的查找是在某个节点的所有子节点中查找
        var ul = $('ul.lang'); console.log(ul.get(0));                 // 获得 <ul>, get() 返回的是 DOM 对象
        var dy = ul.find('.dy');                                       // 获得 JavaScript, Python, Scheme
        var swf = ul.find('#swift');                                   // 获得 Swift
        var hsk = ul.find('[name=haskell]'); console.log(hsk.get(0));  // 获得 Haskell
        //- ================================================================
        // parent() 从当前节点开始向上查找
        var swf = $('#swift');          // 获得 Swift
        var parent = swf.parent();      // 获得 Swift 的上层节点 <ul>
        var a = swf.parent('div.red');  // 从 Swift 的父节点开始向上查找, 直到找到某个符合条件的节点并返回
        //- ================================================================
        // next() 和 prev() 方法, 对于位于同一层级的节点
        var swift = $('#swift');
        swift.next();                  // Scheme
        swift.next('[name=haskell]');  // Haskell, 因为 Haskell 是后续第一个符合选择器条件的节点
        swift.prev();                  // Python
        swift.prev('.js');             // JavaScript, 因为 JavaScript 是往前第一个符合选择器条件的节点
        //- ================================================================
        // filter() 方法可以过滤掉不符合选择器条件的节点
        var langs = $('ul.lang li'); console.log(langs.length);                   // 拿到 JavaScript, Python, Swift, Scheme 和 Haskell
        var a = langs.filter('.dy'); console.log(a.length);                       // 拿到 JavaScript, Python, Scheme
        langs.filter(function () { return this.innerHTML.indexOf('S') === 0; });  // S 开头, 拿到 Swift, Scheme, this 被绑定为DOM对象, 不是jQuery对象
        //- ================================================================
        // map() 方法把一个 jQuery 对象包含的若干 DOM 节点转化为其他对象
        console.log(langs.map(function(){return this.innerHTML;}).get());  // 用 get() 拿到包含 string 的 Array:['JavaScript', 'Python', 'Swift', 'Scheme', 'Haskell']
        //- ================================================================
        // first()、last() 和 slice() 方法可以返回一个新的 jQuery 对象
        var langs = $('ul.lang li');  // 拿到 JavaScript, Python, Swift, Scheme 和 Haskell
        var js = langs.first();       // JavaScript, 相当于 $('ul.lang li:first-child')
        var haskell = langs.last();   // Haskell, 相当于 $('ul.lang li:last-child')
        var sub = langs.slice(2, 4);  // Swift, Scheme, 参数和数组的 slice() 方法一致
block content
    ul.lang
        li.js.dy JavaScript
        li.dy Python
        li#swift Swift
        li.dy Scheme
        li(name="haskell") Haskell
